<template>
  <el-dialog
    ref="refDlg"
    title="软体产品陈列与维护标准"
    :visible.sync="dialogShow"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    width="700px"
    @close="closeDialog"
  >
    <div>

      <el-tabs v-model="activeName">
        <el-tab-pane label="馨动客餐厅" name="sofa">
          <el-tabs v-show="activeName==='sofa'" tab-position="left">
            <el-tab-pane label="产品陈列标准">
              <div style="height:500px;overflow:auto">
                <img
                  v-for="(item,index) in sofaList1"
                  :key="index"
                  style="width:100%;display:block"
                  :src="src+item"
                  @click="clickPreviewHandle(sofaList1,index)"
                >
              </div>

            </el-tab-pane>
            <el-tab-pane style="height:500px;overflow:auto" label="饰品陈列标准">
              <img
                v-for="(item,index) in decorateList1"
                :key="index"
                style="width:100%;display:block"
                :src="src+item"
                @click="clickPreviewHandle(decorateList1,index)"
              >
            </el-tab-pane>

            <el-tab-pane style="height:500px;overflow:auto" label="产品维护标准">
              <img
                v-for="(item,index) in sofaList2"
                :key="index"
                style="width:100%;display:block"
                :src="src+item"
                @click="clickPreviewHandle(sofaList2,index)"
              >
            </el-tab-pane>
          </el-tabs>
        </el-tab-pane>
        <el-tab-pane label="绿色睡眠馆" name="soft">
          <el-tabs v-show="activeName==='soft'" tab-position="left">
            <el-tab-pane style="height:500px;overflow:auto" label="产品陈列标准">
              <img
                v-for="(item,index) in sleepList1"
                :key="index"
                style="width:100%;display:block"
                :src="src+item"
                @click="clickPreviewHandle(sleepList1,index)"
              >
            </el-tab-pane>
            <el-tab-pane style="height:500px;overflow:auto" label="饰品陈列标准">
              <img
                v-for="(item,index) in decorateList2"
                :key="index"
                style="width:100%;display:block"
                :src="src+item"
                @click="clickPreviewHandle(decorateList2,index)"
              >
            </el-tab-pane>

            <el-tab-pane style="height:500px;overflow:auto" label="产品维护标准">
              <img
                v-for="(item,index) in sleepList2"
                :key="index"
                style="width:100%;display:block"
                :src="src+item"
                @click="clickPreviewHandle(sleepList2,index)"
              >
            </el-tab-pane>
          </el-tabs>
        </el-tab-pane>
      </el-tabs>

    </div>
    <div slot="footer">
      <el-button size="mini" @click="closeDialog">关闭</el-button>
    </div>
  </el-dialog>
</template>

<script>
export default {
  name: 'SampleDlg',
  props: {
    visible: {
      type: Boolean,
      default: false,
      required: true
    }
  },
  data() {
    return {
      activeName: 'sofa',
      src: 'https://file200.quanyou.com.cn/',
      sofaList1: [// 客餐厅陈列
        'marketing/pgroup1/M00/75/8E/rB8MNGRq3-mAVf41AAXD2fFbTg8010.jpg',
        'marketing/pgroup1/M00/75/8E/rB8MNGRq3-mAfXAVABCwK7gwRnk242.jpg',
        'marketing/pgroup1/M00/75/8E/rB8MM2Rq3-mADPe_ABFFg6HbU7M307.jpg',
        'marketing/pgroup1/M00/75/8E/rB8MM2Rq3-mANv-MABFhcU1cdoU200.jpg',
        'marketing/pgroup1/M00/75/8E/rB8MNGRq4FCAQk3SABHzjbDV6p4993.jpg',
        'marketing/pgroup1/M00/75/8E/rB8MNGRq4FCAWAmrAAuPQGyM7y4219.jpg',
        'marketing/pgroup1/M00/75/8E/rB8MM2Rq4FCAd4IWABXCRVtyMi0370.jpg',
        'marketing/pgroup1/M00/75/8E/rB8MM2Rq4FCASOJwABYg0NXdof0082.jpg',
        'marketing/pgroup1/M00/75/8E/rB8MM2Rq4MGAJFEXABgqupDICNk634.jpg',
        'marketing/pgroup1/M00/75/8E/rB8MM2Rq4MGAdI3RAA8LsO-tpGs605.jpg',
        'marketing/pgroup1/M00/75/8E/rB8MNGRq4MGAWbF6AA9ATkBWh6Q305.jpg',
        'marketing/pgroup1/M00/75/8E/rB8MNGRq4MGAN4kzAAoP3mnk2II307.jpg'
      ],
      sofaList2: [// 客餐厅维护
        'marketing/pgroup1/M00/28/A8/rB8MNGJrc7uABQumAAc6MgVQPQE978.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MM2Jrc-iAR9wfAAZySIIiojo888.jpg',
        'marketing/pgroup1/M00/28/A8/rB8MNGJrdAiARevNAAU3sSBWU6Q560.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MM2JrdBmAQA5iAAfmLKX1uTg223.jpg',
        'marketing/pgroup1/M00/28/A8/rB8MNGJrdCyALOCNAAWX-btxk4U031.jpg',
        // 'marketing/pgroup1/M00/28/A9/rB8MM2JrdDyAPziHAAiubmv2UJQ691.jpg',
        'marketing/pgroup1/M00/29/DF/rB8MNGJ7Ej2AGHkQABoO8TSqthQ381.jpg', // 5/11替换第六张
        // 'marketing/pgroup1/M00/28/A8/rB8MNGJrdFOAaiNWAAtMIVA6ND8527.jpg',
        // 'marketing/pgroup1/M00/28/A9/rB8MM2JrdFiAcXzSAAkoWFFMIeQ792.jpg',
        'marketing/pgroup1/M00/28/CC/rB8MM2Jwk4OAezVKABiDO4EdxQQ543.jpg',
        'marketing/pgroup1/M00/28/CC/rB8MNGJwk4OAC-VNABM2ggIrgqI966.jpg', // 5/3替换第七八张
        'marketing/pgroup1/M00/28/A9/rB8MNGJrdIWAALexAAdu6klG1-U393.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MM2JrdIOASjUjAAwCbGjGd-E002.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MNGJrdIOAP8PwAApCb3f8-9o101.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MM2JrdIOAJpFrAAuyLKhSfKw016.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MNGJrdIOAEO8IAAegnAO5PjU113.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MNGJrdNeAYG4-AAYli1raU_A021.jpg'
      ],
      decorateList1: [// 沙发饰品
        'marketing/pgroup1/M00/28/A3/rB8MNGJrVOWAODNzAAwY5VIy_rE930.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MM2JrVOWAEHifAAYg-fTEpHU933.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MM2JrVOWAEdrsAASZperrRSo846.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MNGJrVOWAZltZAAUmwhVKWTE252.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MM2JrVTeAYzS1AAP9Ycqd7Bc769.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MM2JrVTeATOQeAAgTmBTzZEI251.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MNGJrVTeAcNznAA-JbuxMG7U226.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MNGJrVTeATsB7AAZDJj6Y1pU471.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MNGJrVX6AaLMXAAPiaBGUXBU330.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MM2JrVX6AZsyuAA0BQNOQ52k188.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MM2JrVX6AHdIsAAT1FKVA0Cs999.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MNGJrVX6AbwLfAAWyBRLXXiU624.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MM2JrVbCAc-hTAA4DTYOSJkE707.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MNGJrVbCAfEYIAAYx8kkU-HQ706.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MM2JrVbCAfEbTAAWmrotKGEc402.jpg'
      ],
      sleepList1: [// 睡眠陈列,
        'marketing/pgroup2/M00/14/15/rB8MNWRq4aeADW1dAAVqYLd-TqA364.jpg',
        'marketing/pgroup2/M00/14/15/rB8MNmRq4aeAHVFFAAfCOlVGXgI535.jpg',
        'marketing/pgroup2/M00/14/15/rB8MNmRq4aeAC1tYAAcC_Ko09ME662.jpg',
        'marketing/pgroup2/M00/14/15/rB8MNWRq4aeAWgTlAAW_sK26jrI956.jpg',
        'marketing/pgroup2/M00/14/15/rB8MNWRq4gGAQwtlAAaEyUWFlcE100.jpg',
        'marketing/pgroup2/M00/14/16/rB8MNmRq4gGAAEOCAAXfACb0dZo287.jpg',
        'marketing/pgroup2/M00/14/16/rB8MNmRq4gGASvGvAAUhphJv85g400.jpg',
        'marketing/pgroup2/M00/14/16/rB8MNmRq4gGAcmWuAATzRXhl1R8141.jpg',
        'marketing/pgroup2/M00/14/15/rB8MNWRq4gGAS2zCAARd375LWXI154.jpg'
      ],
      sleepList2: [// 睡眠维护
        'marketing/pgroup1/M00/28/A9/rB8MNGJrdPWAOcb5AARrBx-U1kI866.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MNGJrdPWAXVZ5AAjJ4ZYSarA799.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MNGJrdPWAKIIxAAc4EyuTXec987.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MM2JrdPWAGzILAAioHy_fES8033.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MM2JrdPWATB2zAAYC3NC-VfA722.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MM2JrdPWAfYVoAAU7n9pdhZs874.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MM2JrdPaAaFcMAAgTfq9FbaA350.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MNGJrdPaAG0o9AA0OmlRH73U922.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MNGJrdPaAICj1AAvKGu-VG7Y754.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MNGJrdPaAJM6qAATnV6yLtnY210.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MM2JrdPaADoN4AAhzU-EEG2g116.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MM2JrdPaAFhNMAAlBfcqhENE144.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MNGJrdPaAZ9a5AA1ZJ_bqCDI457.jpg',
        'marketing/pgroup1/M00/28/A9/rB8MM2JrdPaARaSNAAmnVB54gns945.jpg'
      ],
      decorateList2: [// 睡眠饰品
        'marketing/pgroup1/M00/28/A3/rB8MM2JrViKAKY5FAAxZk0LpUjg176.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MM2JrViKAXJG9AArjpKl6OJU467.jpg',
        // 'marketing/pgroup1/M00/28/A3/rB8MNGJrViKAUQ-DAAPy1xuveA4096.jpg',
        'marketing/pgroup1/M00/28/CC/rB8MM2Jwk-WAUmn5AAPYnTdY5OU693.jpg', // 5/3替换第三张
        'marketing/pgroup1/M00/28/A3/rB8MNGJrViKAWpTrAAvgFfJKomU574.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MM2JrVlOAJfj-ABLoO-t83Tg875.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MNGJrVlOAIfqNAAuon46MnWs301.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MM2JrVlOANNy0AAzvolKdQ4k192.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MNGJrVlOAAXexAAj9uUIDaEk748.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MNGJrVoaAfHt9AAZa8ffgi64480.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MM2JrVoaAVRVDAAgqDrWHl-Q879.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MNGJrVoaANNlqAAgcHZRH3Ww985.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MM2JrVoaAOd1jABZ92D6bi8g983.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MNGJrVu2AMIrQAAflhbxG0Kk058.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MM2JrVu2AYwjlAA-GfM1hVGw353.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MNGJrVu2AJ-eDAAXxCmoHlzk321.jpg',
        'marketing/pgroup1/M00/28/A3/rB8MM2JrVu2AULPBAAe099v1qpE463.jpg'
      ]
    }
  },

  computed: {
    dialogShow: {
      get() {
        return this.visible
      },
      set(val) {
        this.$emit('update:visible', val)
      }
    }
  },
  async created() {

  },

  methods: {
    clickPreviewHandle() {

    },
    closeDialog() {
      this.dialogShow = false
    }
  }
}
</script>
<style lang='scss' scoped>
</style>
